<template>
  <div class="h-full box-border overflow-auto bg-gray-100">
    <div class="mx-3 mt-3 rounded shadow-sm bg-white flex flex-col justify-start">
      <div class="mx-auto w-full p-3 rounded overflow-hidden flex flex-col justify-start">
        <div class="mb-3"><i class="fa fa-map" />&nbsp;每日高光地图：（实验性验证数据库及自动任务）</div>
        <HighlitedMap />
      </div>
    </div>
    <div class="mx-3 mt-3 last:mx-3 last:my-3 rounded shadow-sm bg-white flex flex-col justify-start">
      <div class="mx-auto w-full p-3 rounded overflow-hidden flex flex-col justify-start">
        <div class="mb-3"><i class="fa fa-map" />&nbsp;地图查找</div>
        <MapViewer />
      </div>
    </div>
  </div>
</template>

<script lang="ts" setup>
import HighlitedMap from "./HighlitedMap/index.vue"
import MapViewer from "./MapViewer/index.vue"
</script>